﻿<div>
    <MCard Class="d-flex align-start mb-6" Color="grey lighten-2" Flat Height="100" Tile>
        @for (var i = 1; i <= 3; i++)
        {
            <MCard Class="pa-2" Outlined Tile>
                align-start
            </MCard>
        }
    </MCard>

    <MCard Class="d-flex align-end mb-6" Color="grey lighten-2" Flat Height="100" Tile>
        @for (var i = 1; i <= 3; i++)
        {
            <MCard Class="pa-2" Outlined Tile>
                align-end
            </MCard>
        }
    </MCard>

    <MCard Class="d-flex align-center mb-6" Color="grey lighten-2" Flat Height="100" Tile>
        @for (var i = 1; i <= 3; i++)
        {
            <MCard Class="pa-2" Outlined Tile>
                align-center
            </MCard>
        }
    </MCard>

    <MCard Class="d-flex align-baseline mb-6" Color="grey lighten-2" Flat Height="100" Tile>
        @for (var i = 1; i <= 3; i++)
        {
            <MCard Class="pa-2" Outlined Tile>
                align-baseline
            </MCard>
        }
    </MCard>

    <MCard Class="d-flex align-stretch mb-6" Color="grey lighten-2" Flat Height="100" Tile>
        @for (var i = 1; i <= 3; i++)
        {
            <MCard Class="pa-2" Outlined Tile>
                align-stretch
            </MCard>
        }
    </MCard>
</div>